<template>
  <ul class="company-select" v-if="model">
    <li v-for="(item, index) of list" :key="index" @click="onSelect(item)">{{item.name}}</li>
  </ul>
</template>
<script>
export default {
  props: {
    list: {
      type: Array,
      default: []
    }
  },
  data() {
    return {
      model: false
    }
  },
  mounted() {
    // 点击颜色其它区域隐藏
    document.addEventListener('click', this.handleDocumentClick);
    document.addEventListener('touchstart', this.handleDocumentClick);
  },
  methods: {
    onSelect(item) {
      this.model = false
      this.$emit('complete', item)
    },
    handleDocumentClick(e) {
      let text = e.target.getAttribute('class')
      if (Object.prototype.toString.call(text) !== "[object Null]" && (text.indexOf('item-click') > -1 || text.indexOf('ivu-icon-md-arrow-dropdown') > -1)) {
        this.model = !this.model
      } else {
        this.model = false
      }
    }
  }
}
</script>